<template>
  <div class="textAreaPopup">
    <van-popup v-model="show" :close-on-click-overlay="false" round position="bottom" :style="{ height: '45%' }">
      <van-nav-bar :title="popupObj.title" @click-left="onClickLeft" @click-right="onClickRight">
        <template #left>
          <span class="fontColot">取消</span>
        </template>
        <template #right>
          <span>确认</span>
        </template>
      </van-nav-bar>
      <div class="minTextarea">
        <van-field v-model="textArea" type="textarea" placeholder="" input-align="left" autosize />
      </div>
    </van-popup>
  </div>
</template>
<script>
export default {
  model: {
    prop: "show",
    event: "onEmit"
  },
  props: {
    show: {
      type: Boolean,
      default: false
    },
    popupObj: {
      type: Object,
      default: {
        title: "",
        api: "",
        params: {}
      }
    }
  },
  data() {
    return {
      textArea: ""
    };
  },
  methods: {
    onClickLeft() {
      this.$emit("childPost", false);
      this.popupObj.title = "";
      this.popupObj.api = "";
      this.popupObj.params = "";
    },
    onClickRight() {
      // this.show = false;
      console.log(this.popupObj, "popupObj");
      let json = this.popupObj.params;
      json.remark = this.textArea;
      this.textAreaSubmitPost(json);
    },
    async textAreaSubmitPost(json) {
      let data = await $http.post(this.popupObj.api, json);
      console.log(data, "datadatadatadata");
      if (data.result) {
        this.$toast(data.msg);
        this.$emit("subPost", false);
      } else {
        this.$toast(data.msg);
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.minTextarea {
  height: 30vh;
  overflow-y: scroll;
  margin: 0.75rem;
  margin-top: 0;
  background: #f5f5f5 !important;
  height: 13.34rem !important;
  .van-cell {
    background: #f5f5f5 !important;
  }
}
.fontColot {
  color: #aaaab3;
}
</style>
